@media screen and (max-width: 767px) {
  .logo a img {
    height: 36px;
  }
  .site-content {
    min-height: auto;
    .content-area {
      padding-top: 0;
    }
  }
  .site-header {
    position: relative;
    .navbar {
      display: none;
      float: none;
      position: absolute;
      left: 0;
      top: $header-height;
      padding: 15px 0 15px 30px;
      width: 100%;
      background: #efefef;
      border-bottom: 1px solid $grey-border;
      box-shadow: 0 2px 3px #dfdfdf;
      z-index: 9999;
      ul {
        li {
          width: 100%;
          padding: 10px 0;
          &::before {
            display: none;
          }
        }
      }
    }
    .button-wrap {
      display: block;
    }
  }

  .post {
    .nav-links {
      display: none;
    }
  }

  .footer-widgets {
    .row {
      .col-1-1,
      .col-1-2,
      .col-1-3,
      .col-1-4 {
        float: none;
        width: auto;
        margin-bottom: 50px;
      }
    }
  }

  .archive ul.list {
    padding-left: 20px;
  }

}


@media screen and (max-width: 320px) {
  .container {
    padding-left: 20px;
    padding-right: 20px;
  }
  .site-header,
  .page .site-header,
  .home.paged .site-header {
    padding-left: 20px;
    padding-right: 20px;

  }
  .footer-widgets .inside-wrapper {
    padding-left: 5px;
    padding-right: 5px;
  }

}
